<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Grayscaling and inverting color | Canvas pixel manipulation</title>
  </head>
  <body>
    <canvas id="canvas" width="300" height="227"></canvas>
    <form>
			<input type="radio" id="original" name="color" value="original" checked>
  		<label for="original">Original</label>

			<input type="radio" id="grayscale" name="color" value="grayscale">
  		<label for="grayscale">Grayscale</label>

			<input type="radio" id="inverted" name="color" value="inverted">
      <label for="inverted">Inverted</label>
      
      <input type="radio" id="sepia" name="color" value="sepia">
  		<label for="sepia">Sepia</label>
    </form>
		<script src="color-manipulation.js"></script>
  </body>
</html>
